<!DOCTYPE html>
<html>
	<meta charset="UTF-8">
	<head>
		<meta charset="utf-8" />
		<title>个人主页</title>
		<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
		<link rel="stylesheet" type="text/css" href="css/iconfont/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="css/index.css" />
		<link rel="stylesheet" type="text/css" href="css/about.css" />
	</head>
	<body>
		<div class="about-page">
			<div class="mask"></div>
			<div class="about-banner">
				<h3>About Me</h3>
			</div>
		</div>
		<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
			<div class="panel panel-default">
				<div class="panel-heading" role="tab" id="headingOne">
					<h4 class="panel-title">
						<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true"
						 aria-controls="collapseOne">
							<div class="tab-items">
								<h4>个人信息</h4>
							</div>
						</a>
					</h4>
				</div>
				<div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
					<div class="panel-body">
						<div class="information">
							<div class="info-wrapper">
								<p>
									<span class="left-side">昵称</span><span class="right-side">狗剩先生</span>
								</p>
								<p>
									<span class="left-side">性别</span><span class="right-side">男</span>
								</p>
								<p>
									<span class="left-side">邮箱</span><span class="right-side">1056040932@qq.com</span>
								</p>
							</div>
							<div class="info-wrapper">
								<p>
									<span class="left-side">年龄</span><span class="right-side">21</span>
								</p>
								<p>
									<span class="left-side">学历</span><span class="right-side">本科</span>
								</p>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="panel panel-default">
				<div class="panel-heading" role="tab" id="headingTwo">
					<h4 class="panel-title">
						<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"
						 aria-expanded="false" aria-controls="collapseTwo">
							<div class="tab-items">
								<h4>个人知识储备情况</h4>
							</div>
						</a>
					</h4>
				</div>
				<div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
					<div class="panel-body">
						<div class="knowledge">
							<p>1、对前端开发摸索已有3年</p>
							<p>2、可以独自使用 html/css/js 完成网站前端部分</p>
							<p>3、能够独立使用 Vue 完成网站前端部分 </p>
							<p class="projects">
								<span class="tags">独立开发</span>
								模仿网易云商城项目地址：<a href="https://gitee.com/mr_dog_left/hz_shop">https://gitee.com/mr_dog_left/hz_shop.git</a>
							</p>
							<p class="projects">
								<span class="tags">独立开发</span>
								原创移动端校园商城项目地址： <a href="https://gitee.com/mr_dog_left/xiaoji_v1.0.3">https://gitee.com/mr_dog_left/xiaoji_v1.0.3.git</a>
							</p>
						</div>
					</div>
				</div>
			</div>
			<div class="panel panel-default">
				<div class="panel-heading" role="tab" id="headingThree">
					<h4 class="panel-title">
						<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree"
						 aria-expanded="false" aria-controls="collapseThree">
							<div class="tab-items">
								<h4>Github/码云</h4>
							</div>
						</a>
					</h4>
				</div>
				<div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
					<div class="panel-body">
						<div class="code-address">
							<div class="info first-item">
								<span>Github 地址</span>
								<p><a href="https://gitee.com/mr_dog_left/hz_shop">github.com/gssteelyoursugar</a></p>
							</div>
							<div class="info second-item">
								<span>码云地址</span>
								<p><a href="https://gitee.com/mr_dog_left/xiaoji_v1.0.3">gitee.com/mr_dog_left</a></p>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- <div class="about-navbar">
			<ul class="nav nav-tabs nav-stacked" role="tablist">
				<li role="presentation" class="active">
					<a href="#home" aria-controls="home" role="tab" data-toggle="tab">个人信息</a>
				</li>
				<li role="presentation">
					<a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">个人能力</a>
				</li>
				<li role="presentation">
					<a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Github/码云</a>
				</li>
			</ul>

			<div class="tab-content">
				<div role="tabpanel" class="tab-pane active" id="home">
					<div class="tab-items">
						<h4>个人信息</h4>
					</div>
					<div class="information">
						<div class="info-wrapper">
							<p>
								<span class="left-side">昵称</span><span class="right-side">狗剩先生</span>
							</p>
							<p>
								<span class="left-side">性别</span><span class="right-side">男</span>
							</p>
							<p>
								<span class="left-side">邮箱</span><span class="right-side">1056040932@qq.com</span>
							</p>
						</div>
						<div class="info-wrapper">
							<p>
								<span class="left-side">年龄</span><span class="right-side">21</span>
							</p>
							<p>
								<span class="left-side">学历</span><span class="right-side">本科</span>
							</p>
						</div>
					</div>
				</div>
				<div role="tabpanel" class="tab-pane" id="profile">
					<div class="tab-items">
						<h4>个人知识储备情况</h4>
					</div>
					<div class="knowledge">
						<p>1、对前端开发摸索已有3年</p>
						<p>2、可以独自使用 html/css/js 完成网站前端部分</p>
						<p>3、能够独立使用 Vue 完成网站前端部分 </p>
						<p class="projects">
							<span class="tags">独立开发</span>
							模仿网易云商城项目地址：<a href="https://gitee.com/mr_dog_left/hz_shop">https://gitee.com/mr_dog_left/hz_shop.git</a>
						</p>
						<p class="projects">
							<span class="tags">独立开发</span>
							原创移动端校园商城项目地址： <a href="https://gitee.com/mr_dog_left/xiaoji_v1.0.3">https://gitee.com/mr_dog_left/xiaoji_v1.0.3.git</a>
						</p>
					</div>
				</div>
				<div role="tabpanel" class="tab-pane" id="settings">
					<div class="tab-items">
						<h4>Github/码云</h4>
					</div>
					<div class="code-address">
						<div class="info first-item">
							<span>Github 地址</span>
							<p>github.com/gssteelyoursugar</p>
						</div>
						<div class="info second-item">
							<span>码云地址</span>
							<p>gitee.com/mr_dog_left</p>
						</div>
					</div>
				</div>
			</div>
		</div> -->
		<div class="about-footer">
			<div class="fast-item">
				<dl>
					<dt>
						我的主页
					</dt>
					<dd>
						<a id="pothographs" href="index.html">首页</a>
					</dd>
					<dd>
						<a id="pothographs" href="pothograph.html">个人风采</a>
					</dd>
				</dl>
				<dl>
					<dt>
						关于我
					</dt>
					<dd>
						<a id="introduce" href="about.html">个人简介</a>
					</dd>
				</dl>
			</div>
			<div class="copyright">
				<span>Copyright &copy 2019, chmee.cn</span>
				<span>All Rights Reserved</span>
			</div>
		</div>
		<div class="bg fixed"></div>
	</body>
	<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/bootstrap.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script type="text/javascript" src="js/index.js"></script>
</html>
